<script setup>
import {ref} from 'vue'
const items = ref([
{id:1,name:'张三',age:18,join:'老师'},
{id:2,name:'李四',age:12,join:'医生'},
{id:3,name:'王五',age:15,join:'护士'}
])
</script>
<!-- 在 <script>中是引入其他文本-->
<!-- 在<tempalte>中主要是写页面代码展示样式 -->

<template>
  <table>
    <thead>
      <tr><td>ID:</td>
    <td>姓名:</td>
     <td>年龄:</td>
    <td>职业:</td>
    </tr>
</thead>
<tbody>
<tr v-for="index in items" :key="index.id">
    <td>{{ index.id }}</td>
    <td>{{ index.name }}</td>
     <td>{{ index.age }}</td>
    <td>{{ index.join }}</td>
</tr>
</tbody>
</table>
 </template>
<!-- 在 <style>中主要是写页面结构的格式，加上scoped时只能影响当前文本的样式-->
<style scoped>

</style>
